<!-- 包材管理 - 综合表单页面 -->
<template>
  <div class="page-container">
    <ex_super_table_page v-bind="option" ref="SuperTablePage" @selection-change="e => selection = e">
    </ex_super_table_page>
    <ex_super_dialog_form ref="formDialog" v-bind="dialog" @afterSubmitSuccess="reload()" />

    <ex_super_dialog_form ref="formDialogAddStock" v-bind="dialogAddStock" @afterSubmitSuccess="reload()" />


    <dialog_detail_desc ref="dialog_detail_desc" url="/wms-api/base/WmsBasePackMaterialStockRpc/detail.json"
      :descOption="descOption" />
    <print_common_temp ref="print_common" businessType="PACK_MATERIAL" :tableModel="[
      { key: 'code', label: 'label_pack_material_code', 'min-width': 120, 'show-overflow-tooltip': true, },
      { key: 'name', label: 'label_pack_material_name', 'min-width': 120, 'show-overflow-tooltip': true, },
      // { key: 'materialTypeName', label: 'label_pack_material_type_name', 'width': 120, 'show-overflow-tooltip': true, },

    ]" :metaHandler="(data, row) => {
  return {
    packMaterialName: row.name,
    packMaterialCode: row.code,
  }
}" />
  </div>
</template>
<script>
import print_common_temp from '@/component/print/print_common_temp'

import superTablePageFunction from '@/mixin/super-table-page-function';
// 

export default {
  title: 'title_pack_material_manage',
  mixins: [superTablePageFunction],
  components: { print_common_temp, },
  data() {
    return {
      selection: [],


      option: {
        //搜索框内容
        search: {
          //搜索框内容，key为搜索字段，label为标签提示

          model: [

            {
              label: "label_pack_material_type", key: "typeId", type: 'select',
              url: '/wms-api/base/WmsBasePackMaterialTypeRpc/selectLabel.json', storeData: true,
              urlParams: { warehouseId: 'warehouseId' }, filterable: true,
              option: { label: 'name', value: 'id' },//
            },
            { label: "label_name", key: "name", type: 'input', },//

            {
              label: "label_status", key: "status", type: 'select', enum: 'IsAvailableStatusEnum',
            },

            {
              label: "label_start_time",
              key: "createDateStart",
              fold: true,
              type: 'date-picker',
              attrs: { type: "datetime" },
            },
            {
              label: "label_end_time",
              key: "createDateEnd",
              fold: true,
              type: 'date-picker',
              attrs: { type: "datetime" },
            },

            //所有元素均可添加可选attrs对象增加属性，详细属性列表由element-ui提供
          ],
        },
        action: [
          {
            label: 'label_add_pack_material', auth: 'wms_material_stock_edit', attrs: { icon: "el-icon-plus" }, click: () => {
              this['$refs']['formDialog'].showNew({
                title: this.$tt('label_add_pack_material'),
                data: {},
                setOnlyData: true
              })
            }
          },
        ],
        actionExtra: [
          {
            label: { _key: 'label_print_any', i18n: true, type: "label_pack_material" }, attrs: { type: "primary" }, click: (row) => {
              if (_.isEmpty(this.selection)) {
                return this.$message.error(this.$tt('tip_please_select_order'))
              }
              this.$refs.print_common.show(this.selection)
            }
          },
        ],
        table: {
          url: "/wms-api/base/WmsBasePackMaterialStockRpc/selectPage.json",
          attrs: {},
          model: [
            { type: 'selection', clickToggle: true, keyGroup: 'label_table_operate' },

            {
              key: 'code', label: 'label_pack_material_code',
              render: (h, { row, column }) => {
                const code = row[column.property]
                if (!code) return this.$tt('data_temp_none')
                return (<text_extra_tooltip_operate
                  value={code} extra_barcode_image extra_text_align='center'
                  data_type={column.property} data_id={row.id}
                />)
              },
            },


            { key: 'status', label: 'label_status', formatter: (r, c, v, i) => this.$enumShow(v, "IsAvailableStatusEnum") },
            { key: 'name', label: 'label_pack_material_name', },
            { key: 'warehouseCode', label: 'label_warehouse_code', },
            { key: 'materialTypeCode', label: 'label_pack_material_type_code', },
            { key: 'material', label: 'label_material', },
            { key: 'shape', label: 'label_shape', },
            { key: 'usage', label: 'label_usage', },
            { key: 'length', label: 'label_length', formatter: (r, c, v, i) => `${v}cm` },
            { key: 'width', label: 'label_width', formatter: (r, c, v, i) => `${v}cm` },
            { key: 'height', label: 'label_height', formatter: (r, c, v, i) => `${v}cm` },
            { key: 'volume', label: 'label_pack_material_volume', formatter: (r, c, v, i) => `${v}m³` },
            { key: 'packVolume', label: 'label_inner_capacity', formatter: (r, c, v, i) => `${v}m³` },
            { key: 'weight', label: 'label_weight', formatter: (r, c, v, i) => `${v}kg` },
            { key: 'stockQty', label: 'label_stock_count', },
            { key: 'price', label: 'label_unit_price', },
            {
              type: 'operate', width: 160, fixed: "right", operate: [
                {
                  type: 'more',
                  items: [
                    { label: 'label_view_detail', click: (row) => this.clickDetail(row) },
                    { label: 'label_edit_stock', auth: 'wms_container_stock_edit_stock', click: (row) => { this.checkStock(row) } },
                    {
                      label: 'label_edit_pack_material', auth: 'wms_material_stock_edit', click: (row) => {
                        this['$refs']['formDialog'].showNew({
                          title: this.$tt('label_edit_pack_material'),
                          params: { "id": row["id"] },
                        })
                      }
                    },

                  ]
                },
                {
                  label: 'label_delete', auth: 'wms_material_stock_delete', type: "confirm-button",
                  url: '/wms-api/base/WmsBasePackMaterialStockRpc/remove.json', message: 'text_confirm_sure_delete',
                  buttonClass: "button_text_danger",
                  confirmButtonType: 'danger',
                  params: (row) => { return { "id": row["id"] } }, done: ['reload', 'tip']
                },
              ]
            },
          ],

        }
        ,

      },

      dialog: {
        customClass: 'dialog_auto',
        submitUrl: '/wms-api/base/WmsBasePackMaterialStockRpc/saveUpdate.json',
        detailUrl: '/wms-api/base/WmsBasePackMaterialStockRpc/detail.json',
        form: {
          itemClass: "form_item_mini", inputClass: "form_input_small",
          formClass: "form_mini_col2",
          inline: true,
          //弹窗表单设置，设置方式与搜索框对象一致。
          model: [
            { header: "label_base_info", },
            { key: 'code', label: 'label_pack_material_code', },
            { key: 'name', label: 'label_pack_material_name', },
            { key: 'nameEn', label: 'label_pack_material_name_en', },
            { key: 'shape', label: 'label_shape', type: 'select', enum: 'BaseShapeEnum' },
            {
              label: "label_pack_material_type", key: "materialTypeId", type: 'select',//自动从远程url获取列表内容
              url: '/wms-api/base/WmsBasePackMaterialTypeRpc/selectLabel.json', storeData: true,
              urlParams: { warehouseId: 'warehouseId' }, filterable: true,
              option: { label: 'name', value: 'id' }, keyExtra: { code: 'materialTypeCode', }//用于标记回传列表内的显示字段与筛选字段，label为显示，value为筛选
            },

            { key: 'material', label: 'label_material', },
            { key: 'materialUsage', label: 'label_usage', },
            { key: 'length', label: 'label_length', append: 'cm', appendClass: 'input_slot_div_mini' },
            { key: 'width', label: 'label_width', append: 'cm', appendClass: 'input_slot_div_mini' },
            { key: 'height', label: 'label_height', append: 'cm', appendClass: 'input_slot_div_mini' },
            { key: 'volume', label: 'label_pack_material_volume', append: 'm³', appendClass: 'input_slot_div_mini' },
            { key: 'packVolume', label: 'label_inner_capacity', append: 'm³', appendClass: 'input_slot_div_mini' },
            { key: 'weight', label: 'label_weight', append: 'kg', appendClass: 'input_slot_div_mini' },
            { key: 'price', label: 'label_unit_price', },
            { key: 'remark', label: 'label_remark', },
            { key: 'barcodeManage', label: 'label_is_barcode_manage', type: 'select', enum: 'YesOrNoEnum' },
          ],
          rules: {
            'code': [{ required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            {
              validator: (r, v, cb) => {
                if (!this.$reg.Code128(v)) {
                  return cb(this.$t("tip_format_error"))
                }
                cb()
              }, trigger: 'change'
            }],
            'status': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'name': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'materialTypeId': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'material': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'usage': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'length': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'width': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'height': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'volume': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'packVolume': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'weight': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'price': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'barcodeManage': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'shape': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
          },
        }
      },
      dialogAddStock: {
        customClass: 'dialog_auto',
        submitUrl: '/wms-api/base/WmsBasePackMaterialStockRpc/modifyStock.json',
        form: {
          itemClass: "form_item_mini", inputClass: "form_input_small",
          model: [
            {
              key: 'changeType', label: 'label_change_type', type: "select",
              enum: 'BaseMaterialStockChangeTypeEnum'
            },
            {
              key: 'number', label: 'label_change_number', type: "input-number",
              attrs: {
                min: 1, 'step-strictly': true,
              },
            },
          ],
          rules: {
            'changeType': { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
            'number': { required: true, type: "number", min: 1, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
          },
        },
      },
      descOption: {
        model: [
          { key: 'code', label: 'label_pack_material_code', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'name', label: 'label_pack_material_name', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'status', label: 'label_status', formatter: (r, c, v) => this.$enumShow(v, "BaseContainerStatusEnum") },
          { key: 'containerTypeCode', label: 'label_container_type_code', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'materialTypeCode', label: 'label_pack_material_type_code', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'warehouseCode', label: 'label_warehouse_code', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'material', label: 'label_material', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'shape', label: 'label_shape', formatter: (r, c, v) => this.$enumShow(v, "BaseShapeEnum") },
          { key: 'usage', label: 'label_usage', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'length', label: 'label_length', formatter: (r, c, v, i) => `${v}cm` },
          { key: 'width', label: 'label_width', formatter: (r, c, v, i) => `${v}cm` },
          { key: 'height', label: 'label_height', formatter: (r, c, v, i) => `${v}cm` },
          { key: 'volume', label: 'label_pack_material_volume', formatter: (r, c, v, i) => `${v}m³` },
          { key: 'packVolume', label: 'label_inner_capacity', formatter: (r, c, v, i) => `${v}m³` },
          { key: 'weight', label: 'label_weight', formatter: (r, c, v, i) => `${v}kg` },
          { key: 'stockQty', label: 'label_stock_count', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'price', label: 'label_unit_price', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'remark', label: 'label_remark', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'barcodeManage', label: 'label_is_barcode_manage', formatter: (r, c, v) => this.$enumShow(v, "YesOrNoEnum") },
          { key: 'creator', label: 'label_create_user', render: (h, { data, item }) => this.$renderText(h, data[item.key]) },
          { key: 'gmtCreate', label: 'label_create_time', formatter: (r, c, v, i) => this.$dateFormat(v) },
        ],
      },
    };
  },
  methods: {
    checkStock(row) {
      // this.form.id = row.id
      // this.visible = true
      this['$refs']['formDialogAddStock'].showNew({
        title: this.$tt('label_edit_stock'),
        data: { "id": row["id"], number: 1, },

      })
    },
    resetForm(formName) {
      this.visible = false
      this.$refs[formName].resetFields();
    },
    addStockForm() {

      let data = this.form

      this.$ajax({
        url: '/wms-api/base/WmsBasePackMaterialStockRpc/modifyStock.json',
        type: 'json',
        data,
        success: (responseData) => {
          this.$message({
            type: 'success',
            message: this.$t('tip_operate_success')
          })
          // this.$emit('afterSubmitSuccess', this.$refs.form.getData())
          this.visible = false
          this.reload()
        },
        complete: () => {
          this.submiting = false
        }

      });
    },
    clickDetail(row) {
      let title = '包材明细：' + row.code
      this.$refs['dialog_detail_desc'].show({ params: { id: row.id }, title })
    },
  }
};

</script>
<style></style>
